<template>
	<div>
		默认
		<div style="text-align: center" :class="[name]">{{ name }}</div>
		<component :is="'h1'" v-bind="$attrs">{{ $attrs.age }}</component>
	</div>
</template>

<script lang="ts">
import { defineComponent } from 'vue'

export default defineComponent({
	// props里面没有的属性回集成到$attrs里,所以age就在sttrs里面
	props: {
		name: {
			type: String,
		},
	},
	// 如果setup内返回node，上面template将无效
	// setup(props, context) {
	//     const readersNumber = ref(0);
	//     const book = reactive({ title: "Vue 3 Guide" });
	//     // 请注意，我们需要在这里显式地暴露ref值
	//     return () => h("div", [readersNumber.value, book.title]);
	// },
})
</script>

<style scoped></style>
